<!--* 下拉树选择框组件-->
<!--* @module src/components/public-->
<!--* @desc 下拉选择框-->
<!--* @author chenyi-->
<!--* @date 2019年08月15日17:22:43-->

<template>
  <div>
    <el-select
      v-model="values"
      :multiple="multiple"
      :filterable="filterable"
      :allow-create="allowCreate"
      :default-first-option="defaultFirstOption"
      :disabled="disabled"
      :collapse-tags="collapseTags"
      :placeholder="tipText"
      :clearable="clearable"
      style="width: 100%;">
      <el-option :label="tipText" value="" v-if="showTip && !multiple"></el-option>
      <el-option v-for="item in list" :label="item.label" :value="item.value" :key="item.value"
                 :disabled="item.disabled"></el-option>
    </el-select>
  </div>
</template>

<script>
  import {getEnum, getDict, getDataByUrl} from '../../api/getComData'
  import util from '../../libs/util'

  export default {
    name: 'es-select',
    props: {
      multiple: Boolean,//是否多选
      filterable: Boolean,
      allowCreate: Boolean,
      defaultFirstOption: Boolean,
      dictName: String//字典
      , data: Array//json数组
      , enumName: String//枚举
      , url: String //url
      , value: [String, Array]
      , disabled: Boolean//是否禁用
      , collapseTags: Boolean//多选按文字显示
      , showTip: Boolean//是否显示提示
      , clearable: Boolean
      , tipText: {
        type: String,
        default: '请选择'
      }
    },
    model: {
      event: 'changeValue'
    },
    data: function () {
      return {
        list: [],
        values: this.value,
      }
    },
    mounted: function () {
      let _this = this
      if (_this.dictName) {
        _this.list = util.getLocalStorageItem(_this.dictName)
        if (!_this.list) {
          getDict({dictName: _this.dictName}).then((res) => {
            _this.list = res.data
            util.setLocalStorageItem(_this.dictName, res.data)
          })
        }
      } else if (_this.enumName) {
        _this.list = util.getLocalStorageItem(_this.enumName)
        if (!_this.list) {
          getEnum({enumName: _this.enumName}).then((res) => {
            _this.list = res.data
            util.setLocalStorageItem(_this.enumName, res.data)
          })
        }
      } else if (_this.url) {
        getDataByUrl(_this.url, {enumName: _this.enumName}).then((res) => {
          _this.list = res.data
        })
      } else if (_this.data) {
        _this.list = _this.data
      } else {
        console.error('未指定数据源')
        return false
      }
    },
    watch: {
      value: function (val) {
        this.values = val
      },
      values: function (val, oldVal) {
        this.$emit('changeValue', val)
        this.$emit('change', val, oldVal)
      }
    }
  }
</script>

<style scoped>

</style>
